<template>
  <div style="min-width:1366px;">
    <el-card class="TableCard" :body-style="{ padding: '0px' }">
      <div>
        <el-table
          :data="tableData"
          border
          height="750"
          :header-cell-style="{ 'text-align':'center',background: '#3F9DFD', color: '#FFF' }"
          :cell-style="{'text-align':'center'}"
          size="medium"
          stripe
          style="width: 100%;font-size:12px"
        >
          <el-table-column prop="gypc" label="医院频次编码" width="300"></el-table-column>
          <!-- <el-table-column prop="name"
                           label="操作"
                           width="60">
            <el-button type="text"
                       size="mini"
                       @click="dialogVisible = true">编辑</el-button>
          </el-table-column>-->
          <el-table-column prop="pcsm" label="医院频次名称" width="300"></el-table-column>

          <el-table-column label="审查用频次次数" width="180">
            <template slot-scope="scope">
              <el-input v-model="scope.row.times" @change="changeTime(scope.row.id, $event)"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="审查用频次天数" width="180">
            <template slot-scope="scope">
              <el-input v-model="scope.row.days" @change="changeDay(scope.row.id, $event)"></el-input>
            </template>
          </el-table-column>
          <el-table-column label="编辑人员" width="180">
            <template slot-scope="scope">{{scope.row.matchUser}}</template>
          </el-table-column>
          <el-table-column label="编辑时间" width="180">
            <template slot-scope="scope">{{getdate(scope.row.matchTime)}}</template>
          </el-table-column>
        </el-table>
      </div>
      <div class="block">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="queryInfo.pagenum"
          :page-sizes="[20, 50, 100]"
          :page-size="queryInfo.pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="this.total"
          background
        ></el-pagination>
      </div>
    </el-card>
    <!-- <el-dialog
      title="添加新药"
      :visible.sync="dialogVisible"
      width="55%"
      :before-close="handleClose"
    >
      <div>
        <el-form
          :inline="true"
          :model="addRuleAdultData"
          class="demo-form-inline"
          label-width="150px"
          label-position="right"
        >
          <el-form-item label="药品编码">
            <el-input v-model="addRuleAdultData.drugCode"></el-input>
          </el-form-item>
          <el-form-item label="药品名称">
            <el-input v-model="addRuleAdultData.drugName"></el-input>
          </el-form-item>
          <el-form-item label="给药途径ID">
            <el-input v-model="addRuleAdultData.routeIds"></el-input>
          </el-form-item>
          <el-form-item label="给药途径类型">
            <el-input v-model="addRuleAdultData.routeType"></el-input>
          </el-form-item>
          <el-form-item label="给药途径描述">
            <el-input v-model="addRuleAdultData.routeDesc"></el-input>
          </el-form-item>
          <el-form-item label="年龄低值">
            <el-input v-model="addRuleAdultData.ageLow"></el-input>
          </el-form-item>
          <el-form-item label="是否不等于年龄低值">
            <el-select v-model="addRuleAdultData.unequalLow">
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="年龄低值单位">
            <el-select v-model="addRuleAdultData.ageLowUnit">
              <el-option
                v-for="item in dateUnit"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="年龄高值">
            <el-input v-model="addRuleAdultData.ageHigh"></el-input>
          </el-form-item>
          <el-form-item label="是否不等于年龄高值">
            <el-select v-model="addRuleAdultData.unequalHigh">
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="年龄高值单位">
            <el-select v-model="addRuleAdultData.ageHighUnit">
              <el-option
                v-for="item in dateUnit"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="警示内容">
            <el-input v-model="addRuleAdultData.warning"></el-input>
          </el-form-item>
          <el-form-item label="文献资料">
            <el-input v-model="addRuleAdultData.abstractDesc"></el-input>
          </el-form-item>
        </el-form>
      </div>
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="addRuleAge()">新 增</el-button>
        <el-button
          type="primary"
          @click="dialogVisible = false"
        >确 定</el-button>
      </span>
    </el-dialog>-->
    <!-- 显示一条规则 -->
  </div>
</template>
<script>
import {
  getFrequencyList,
  EditFrequencyTime,
  EditFrequencyDay,
  getdate
} from "@/api/rad";
import { Dialog } from "element-ui";
export default {
  data() {
    return {
      queryInfo: {
        page: 1,
        pageSize: 20
      },
      total: 0,
      tableData: []
    };
  },
  created: function() {
    this.getFrequencyList();
  },
  methods: {
    handleClose(done) {
      done();
    },
    handleSizeChange(newSize) {
      this.queryInfo.pageSize = newSize;
      this.getFrequencyList();
    },

    handleCurrentChange(newPage) {
      this.queryInfo.page = newPage;
      this.getFrequencyList();
    },
    async getFrequencyList() {
      let res = await this.$rad.getFrequencyList({
        srm: this.queryInfo.srm,
        page: this.queryInfo.page,
        pageSize: this.queryInfo.pageSize
      });
      (this.tableData = res.rows), (this.total = res.total);
      console.log(res.rows);
    },
    getSearchList() {},
    clearEvent() {},
    async changeTime(id, e) {
      let res = await this.$rad.EditFrequencyTime({
        id: id,
        times: e
      });
      console.log(res);
      if (res.code == 1) {
        this.getFrequencyList();
        return this.$message({
          type: "success",
          message: res.msg
        });
      } else {
        return this.$message({
          type: "error",
          message: res.msg
        });
      }
    },
    async changeDay(id, e) {
      let res = await this.$rad.EditFrequencyDay({
        id: id,
        days: e
      });
      console.log(res);
      if (res.code == 1) {
        this.getFrequencyList();
        return this.$message({
          type: "success",
          message: res.msg
        });
      } else {
        return this.$message({
          type: "error",
          message: res.msg
        });
      }
    },
    getdate(time) {
      return this.$rad.getdate(time);
    }
  }
};
</script>
<style>
.SearchCard {
  height: 50px;
  font-size: 12px;
}
.SearchTitle {
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-right: 1px solid #c2c2c2;
}
.SearchLable {
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.TableCard {
  margin-left: 3px;
  margin-top: 2px;
}
.block {
  text-align: center;
  margin-top: 12px;
  margin-bottom: 12px;
}
</style>